<template>
  <div class="app-container home">
    <el-row>
      <el-col :span="24">
        <el-radio-group v-model="radio1">
          <el-radio-button :label="label1"></el-radio-button>
          <el-radio-button label="待派单"></el-radio-button>
          <el-radio-button label="待安装"></el-radio-button>
          <el-radio-button label="待检测"></el-radio-button>
          <el-radio-button label="待核销"></el-radio-button>
          <el-radio-button label="待付款"></el-radio-button>
          <el-radio-button label="待辅助吊"></el-radio-button>

        </el-radio-group>
        <div slot="header" class="clearfix">
          <span style="color:blue;font-weight: bold;">待办事宜</span>
        </div>
        <div class="grid-content bg-purple-dark">
          <el-table v-loading="loading" :data="orderList">
            <!-- <el-table-column label="订单ID" align="center" prop="id" /> -->
            <el-table-column label="订单编号" align="center" prop="orderNo" />
            <!-- <el-table-column label="下单用户ID" align="center" prop="userId" /> -->
            <el-table-column label="下单用户姓名" align="center" prop="userName" />
            <!-- <el-table-column label="车辆ID" align="center" prop="carId" /> -->
            <!-- <el-table-column label="车辆编号" align="center" prop="carNo" /> -->
            <el-table-column label="吨位" align="center" prop="carWeight" />
            <el-table-column label="车辆数量 " align="center" prop="carQty" />
            <!-- <el-table-column label="${comment}" align="center" prop="addDriverQty" /> -->
            <!-- <el-table-column label="路基箱数量" align="center" prop="subgradeBoxQty" /> -->
            <el-table-column label="入场时间" align="center" prop="beginTime" width="180">
              <template slot-scope="scope">
                <span>{{ parseTime(scope.row.beginTime, '{y}-{m}-{d}') }}</span>
              </template>
            </el-table-column>
            <el-table-column label="结束时间" align="center" prop="endTime" width="180">
              <template slot-scope="scope">
                <span>{{ parseTime(scope.row.endTime, '{y}-{m}-{d}') }}</span>
              </template>
            </el-table-column>
            <el-table-column label="施工月数" align="center" prop="workmonth" />
            <el-table-column label="保证金" align="center" prop="earnestMoney" />
            <el-table-column label="总费用" align="center" prop="totalPrice" />
            <el-table-column label="状态" align="center" prop="orderState" />

            <!-- <el-table-column label="机长数量" align="center" prop="captain" />
            <el-table-column label="施工方式" align="center" prop="chargeType" />
            <el-table-column label="取车时间" align="center" prop="pickCarTime" width="180">
              <template slot-scope="scope">
                <span>{{ parseTime(scope.row.pickCarTime, '{y}-{m}-{d}') }}</span>
              </template>
            </el-table-column>
            <el-table-column label="保险" align="center" prop="insurance" />
            <el-table-column label="维护" align="center" prop="upkeep" />
            <el-table-column label="工作时长" align="center" prop="workMonth" />
            <el-table-column label="地址ID" align="center" prop="workAddressId" />
            <el-table-column label="地址" align="center" prop="workAddress" />
            <el-table-column label="施工场景" align="center" prop="workEnv" />
            <el-table-column label="工作内容" align="center" prop="workContent" />
            <el-table-column label="是否有保证金 0：没有，1：有" align="center" prop="earnestMoneyFlag" />
            
            <el-table-column label="折扣" align="center" prop="discount" />
            <el-table-column label="税率" align="center" prop="rate" />
            <el-table-column label="运输方式" align="center" prop="shipMode" />
            <el-table-column label="增配驾驶员" align="center" prop="addDriver" />
            <el-table-column label="增配驾驶员金额" align="center" prop="addDriverPrice" />
            <el-table-column label="就餐" align="center" prop="eat" />
            <el-table-column label="${comment}" align="center" prop="eatPrice" />
            <el-table-column label="住宿" align="center" prop="sleep" />
            <el-table-column label="${comment}" align="center" prop="sleepPrice" />
            <el-table-column label="燃油" align="center" prop="oil" />
            <el-table-column label="${comment}" align="center" prop="oilPrice" />
            <el-table-column label="拆卸人工" align="center" prop="dismantlePerson" />
            <el-table-column label="${comment}" align="center" prop="dismantlePersonPrice" />
            <el-table-column label="拆卸辅助吊车" align="center" prop="dismantleCar" />
            <el-table-column label="${comment}" align="center" prop="dismantleCarPrice" />
            <el-table-column label="组装辅助吊车" align="center" prop="packageCar" />
            <el-table-column label="${comment}" align="center" prop="packgaCarPrice" />
            <el-table-column label="安装人工" align="center" prop="installPerson" />
            <el-table-column label="${comment}" align="center" prop="installPersonPrice" />
            <el-table-column label="年检检测" align="center" prop="yearCheck" />
            <el-table-column label="${comment}" align="center" prop="yearCheckPrice" />
            <el-table-column label="委托检测" align="center" prop="entrustCheck" />
            <el-table-column label="${comment}" align="center" prop="entrustCheckPrice" />
            <el-table-column label="环保检测" align="center" prop="envCheck" />
            <el-table-column label="${comment}" align="center" prop="envCheckPrice" />
            <el-table-column label="使用登记证" align="center" prop="certificate" />
            <el-table-column label="${comment}" align="center" prop="certificatePrice" />
            <el-table-column label="体检" align="center" prop="medical" />
            <el-table-column label="${comment}" align="center" prop="medicalPrice" />
           
            <el-table-column label="司机ID" align="center" prop="driverId" />
            <el-table-column label="司机名称" align="center" prop="driverName" />
            <el-table-column label="合同编号" align="center" prop="contractNo" />
            <el-table-column label="${comment}" align="center" prop="invoice" /> -->
            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
              <template slot-scope="scope">
                <el-button size="mini" type="text" icon="el-icon-service" @click="handleUpdate(scope.row)"
                  v-hasPermi="['system:type:edit']">派单</el-button>
              </template>
            </el-table-column>
          </el-table>

          <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pageSize" @pagination="getList" />

          <!-- 派单对话框 -->
          <el-dialog title="派单" :visible.sync="open" width="500px" append-to-body>
            <el-form ref="form" :model="form" label-width="80px">
              <el-form-item label="选择司机">
                <el-select v-model="form.driverId" placeholder="请选择" filterable @change="handleSelectChange">
                  <el-option v-for="item in driverList" :key="item.id" :label="item.driverName"
                    :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
              <el-button type="primary" @click="submitForm">确 定</el-button>
              <el-button @click="cancel">取 消</el-button>
            </div>
          </el-dialog>

        </div>
      </el-col>
    </el-row>

  </div>

</template>

<script>
import { listOrder } from "@/api/system/order";
import { listInfo } from "@/api/system/info";
export default {
  name: "Index",
  data() {
    return {
      // 版本号
      version: "3.8.8",
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10
      },
      // 总条数
      total: 0,
      // 订单列表格数据
      orderList: [],
      radio1: "",
      label1: "全部",
      form: {
        driverId: null,
      },
      open: false,
      driverList: [],

    };
  },
  created() {
    this.getList();

  },


  methods: {
    goTarget(href) {
      window.open(href, "_blank");
    },
    //查询待办订单列表
    getList() {
      this.loading = true;
      listOrder(this.queryParams).then(response => {
        this.orderList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },

    //派单方法
    handleUpdate(row) {
      const id = row.id || this.ids
      console.log(row);

      this.open = true;
      listInfo().then(response => {
        this.driverList = response.rows;
      });
    },

    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
    },

    //派单页面提交
    submitForm() {
      this.$modal.msgSuccess("派单成功");
      this.open = false;
    },

    //下拉框change事件
    handleSelectChange(value) {
      // getCustomer(value).then(response => {
      //   console.log(response);
      //   this.form.customerName = response.data.name;
      // });
    },


  }
};
</script>

</style>
